/**
 * Created by heshufen on 20/6/21.
 */
import React from 'react';
import {Dimensions, ImageBackground, StyleSheet, Text, View} from 'react-native';
import TextButton from './components/TextButton';
import {isIPhoneXFooter} from './utils/iphoneUtils';
import Screen from './screens/base/Screen';

const screenWidth = Dimensions.get('window').width;

export default class FirstScreen extends Screen {
    constructor(props) {
        super(...arguments);
    }

    getBarStyle() {
        return 'light-content';
    }

    needSafeAreaView() {
        return false;
    }

    renderBody(navigation) {
        return (
            <ImageBackground style={styles.bg}
                             source={require('./assets/login/icon_bg.png')}>
                <View style={styles.bottomContainer}>
                    <TextButton style={styles.buttonStyle} textStyle={styles.textStyle} text='手机号登录' onPress={() => {
                        navigation.navigate('Login');
                    }}/>
                    <View><Text style={styles.see} onPress={() => {
                        alert('随便看看');
                    }}>随便看看</Text><View style={styles.underLine}/></View>
                    <Text style={styles.agreeText}>登录即表示同意<Text style={styles.agreeText1} onPress={() => {
                        alert('服务用户协议');
                    }}>《服务用户协议》</Text>和<Text style={styles.agreeText1} onPress={() => {
                        alert('用户隐私政策');
                    }}>《用户隐私政策》</Text></Text>
                </View>
            </ImageBackground>
        );
    }
}

const styles = StyleSheet.create({
    bg: {
        flex: 1,
    },
    bottomContainer: {
        width: screenWidth,
        position: 'absolute',
        alignItems: 'center',
        justifyContent: 'center',
        bottom: isIPhoneXFooter(35),
    },
    see: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 15,
        color: '#ffffff',
        marginBottom: 1,
    },
    underLine: {
        height: 1,
        opacity: 0.8,
        backgroundColor: '#fff',
        marginBottom: 77,
    },
    agreeText: {
        fontFamily: 'PingFang-SC-Medium',
        fontSize: 13,
        color: '#acacac',
    },
    agreeText1: {
        fontFamily: 'PingFang-SC-Medium',
        fontSize: 13,
        color: '#fff',
    },
    buttonStyle: {
        marginBottom: 32,
        width: 282,
        height: 51,
        opacity: 0.8,
        borderRadius: 26,
        backgroundColor: '#ff375c',
        alignItems: 'center',
        justifyContent: 'center',
    },
    textStyle: {
        fontFamily: 'PingFang-SC-Medium',
        fontSize: 18,
        color: '#ffffff',
    },
});
